<template>
    <div>
        	<ul class="mui-table-view">
				<li class="mui-table-view-cell mui-media" v-for="item in newslist" :key="item.id">
					<router-link :to="'/home/newsinfo' + item.id">
						<img class="mui-media-object mui-pull-left" :src="item.image">
						<div class="mui-media-body">
							{{item.title}}
							<p class='mui-ellipsis'>
                                <span>发表时间：{{item.add_time| dateFormat }}</span>
                                <span>点击次数：{{item.click}}</span>
                            </p>
						</div>
					</router-link>
				</li>
			</ul>
    </div>
</template>
<script>
import {Toast} from 'mint-ui'

export default {
    data(){
        return{
            newslist: []
        }
    },
    created(){
        this.getnewslist()
    },
    methods:{
        //需要在声明周期函数created中调用
        getnewslist(){
            this.$http.get('src/json/newslist.json').then(result=>{
                if(result.body.status === 0){
                    console.log("成功了");
                    this.newslist = result.body.message
                }else{
                    Toast("失败了")
                }
            })
        }
        
    }
}
</script>
<style >
    .mui-ellipsis{
        display: flex;
        justify-content: space-between;
        color:#226aff
    }
</style>